import React from 'react';
import ReactDOM from 'react-dom';
import { createStore } from './myRedux';
import Vote from './component/Vote';

/*
 * 创建公共容器STORE，REDUCER是管理员
 */
const initialState = {
	title: 'REACT比VUE好学习？',
	supNum: 0,
	oppNum: 0
};
function reducer(state = initialState, action) {
	/* 
	 * state：原始容器中的状态信息（初始容器中没有状态信息，我们给其赋值默认值）
	 * action：组件内部基于dispatch派发的任务对象（要求对象中必须有type属性，因为我们需要基于type判断派发的什么任务，从而修改不同的公共状态信息）
	 */
	//=>为了防止STATE和原始容器中状态公用同一个堆内存，我们需要把其深度克隆
	state = JSON.parse(JSON.stringify(state));
	switch (action.type) {
		case 'SUPPORT':
			state.supNum += action.payload;
			break;
		case 'OPPOSE':
			state.oppNum += action.num;
			break;
	}
	return state; //=>RETURN的是啥，就相当于把原始容器中的状态修改为啥
}
const store = createStore(reducer);

ReactDOM.render(<>
	{/* 在各大组件中，我们需要用到STORE中提供的方法，所以此处把创建的STORE一层层基于属性方式传递给各个组件（方式很傻） */}
	<Vote store={store} />
</>, document.getElementById('root'));